import 'dart:ui';

import 'package:extended_tabs/extended_tabs.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:sports_new/controller/expert/plan_logic.dart';
import 'package:sports_new/utils/utils.dart';
import 'package:sports_new/widgets/loading/loading_widget.dart';
import '../../resources/colours.dart';
import '../../resources/styles.dart';

class PlanPage extends StatefulWidget {
  const PlanPage({super.key});

  @override
  State<PlanPage> createState() => _PlanPageState();
}

class _PlanPageState extends State<PlanPage> with RouteAware {
  final PlanLogic logic = Get.put(PlanLogic());

  @override
  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: const SystemUiOverlayStyle(
          statusBarIconBrightness: Brightness.dark,
          statusBarBrightness: Brightness.dark),
      child: GetBuilder<PlanLogic>(builder: (logic) {
        return LoadingWidget<bool>(
          isLoading: false,
          data: false,
          reconnect: logic.getRefresh,
          child: () => Scaffold(
            body: Stack(
              alignment: AlignmentDirectional.topCenter,
              children: [
                Positioned.fill(
                  child: Container(
                      decoration: const BoxDecoration(
                          gradient: LinearGradient(
                              colors: [Colours.white, Colours.greyF2F3F7],
                              begin: Alignment.topCenter,
                              end: Alignment.bottomCenter,
                              stops: [0.2, 0.3]))),
                ),
                Image.asset(Utils.getImgPath("nav_head_back.png"),
                    width: Get.width, height: Get.width * 128 / 375),
                Column(
                  children: [
                    AppBar(
                      backgroundColor: Colours.transparent,
                      title: Styles.tabbar(
                          controller: logic.tabController,
                          tabs: List.generate(
                                  logic.tabs.length,
                                  (index) => Image.asset(
                                      height: 44,
                                      gaplessPlayback: true,
                                      Utils.getImgPath(
                                          "${logic.tabs[index]}_${logic.tabIndex == index ? "" : "un"}choose.png")))
                              .toList(),
                          labelPadding:
                              const EdgeInsets.symmetric(horizontal: 6),
                          indicatorBottom: 6,
                          onTap: (value) => Utils.onEvent("plan_tab",
                              params: {"tab": logic.tabName[value]}),
                          mainAxisAlignment: MainAxisAlignment.center),
                    ),
                    Expanded(
                      child: ExtendedTabBarView(
                          physics: const ClampingScrollPhysics(),
                          controller: logic.tabController,
                          children: logic.tabView),
                    )
                  ],
                ),
              ],
            ),
          ),
        );
      }),
    );
  }
}
